// 快速处方
import React, { useEffect, useState } from 'react'
import {  NavBar } from 'react-vant';
import { Tabs, Button, Space,Toast  } from 'antd-mobile'
import { UploadOutline } from 'antd-mobile-icons'
import { Sticky,  } from 'react-vant'
// import { DemoBlock } from 'demos'
import axios from 'axios';
import { useSearchParams, useNavigate } from 'react-router-dom'
export default function Su() {
  let [search] = useSearchParams()
  let navigate = useNavigate()
  let [bar1, setBar1] = useState([])
  let [bar2, setBar2] = useState([])
  useEffect(() => {
    getbar1()
    getbar2()
  }, [])
  let getbar1 = async () => {
    let { data: { data } } = await axios.get('http://127.0.0.1:3000/mxd_getoh')
    // console.log(data);
    setBar1(data)

  }
  let getbar2 = async () => {
    let { data: { data } } = await axios.get('http://127.0.0.1:3000/mxd_getcf')
    // console.log(data);
    setBar2(data)
  }
  let tzhist = (id) => {
    navigate('/gg/hist?id=' + id)

  }
  let cj = (id) => {
    navigate('/gg/diy?id=' + id)
  }
  let sc = async (id) => {
    console.log(id);
    let info=bar1.find(item=>item._id==id)
        
    info.cy=!info.cy
    console.log(info);
    let {data}=await axios.post('http://127.0.0.1:3000/mxd_upy',info)
    console.log(data);
    getbar1()
    
    // let { data: { data } } = await axios.get('http://127.0.0.1:3000/mxd_delyp', { params: { id } })
    // console.log(data);


  }
  let scf = async (id) => {
    console.log(id);
    let { data: { data } } = await axios.get('http://127.0.0.1:3000/mdx_sccf', { params: { id } })
    console.log(data);

  }
  let bj = (id) => {
    navigate('/gg/editdiy?id=' + id)
  }
  const [currentTime, setCurrentTime] = useState(getCurrentTime());
  
  // 获取当前时间的函数
  function getCurrentTime() {
    let date = new Date();
    let hours = date.getHours();
    let minutes = date.getMinutes();
    minutes = (minutes < 10 ? '0' : '') + minutes;
    return `${hours}:${minutes}`;

  }
  const xq=(id)=>{
    // console.log(id);
    navigate('/gg/self?id='+id)
  }
  const upcf=async(id)=>{
    console.log(id);
    let info=bar2.find(item=>item._id==id)
    // console.log(info);
    
    info.zt=!info.zt
    console.log(info,'222');
    let {data}=await axios.post('http://127.0.0.1:3000/mxd_cf',info)
    // console.log(data);
    getbar2()
    Toast.show({
      icon:'success',
      content:'设置成功'
    })
    
      
  }
  const xu=(id)=>{
    // console.log(id);
    navigate('/gg/continue?id='+id)
  }
 
  return (
    <div id='Ks'>
      {/* <Sticky style={{ marginLeft: '15px' }}> */}
      
      <div className="top">
      <p onClick={()=>{navigate("/home")}}>
        <span>
          <svg  style={{ width: '30px', height: '35px', position: 'absolute', marginLeft: '5px' }} t="1724675809513" className="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2590" width="200" height="200"><path d="M670.6 861.6c-7.6 0-15.1-2.9-20.9-8.6L329.4 532.7c-11.6-11.5-11.6-30.3 0-41.8l320.2-320.2c5.8-5.8 13.3-8.6 20.9-8.6 7.5 0 15.1 2.9 20.9 8.6 11.5 11.5 11.5 30.2 0 41.8L392 511.8l299.4 299.4c11.5 11.6 11.5 30.3 0 41.8-5.7 5.7-13.3 8.6-20.8 8.6z" fill="#2c2c2c" p-id="2591"></path></svg>
        </span>
        <span style={{ marginLeft: '35px', marginTop: '10px', lineHeight: '33px', fontSize: '20px' }}>快速处方</span>
      
      </p>
      <hr />
      </div>
      {/* </Sticky> */}
      <div className="alls">
        <Tabs>
          <Tabs.Tab title='常见药品' key='fruits'>
            <div className="ge">
              {bar1.filter(item => item.cy).map(item => (
                <div  key={item._id} className="big">
                  <div onClick={()=>{xq(item._id)}} className="img">
                    <img src={item.img} alt="" />
                  </div>
                  <div className="text">
                    <span style={{ fontSize: '18px', display: 'inline-block', marginTop: '10px' }}>{item.name}</span>
                    <span style={{ position: 'absolute', right: '10px', fontSize: '15px', color: 'red', marginTop: '10px' }}>￥{item.price}</span>
                    <p style={{ marginTop: '10px', color: '#999999', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }}>规格：{item.grade}</p>
                    <p style={{ marginTop: '10px', color: '#999999' }}>北京诺华制药有限公司</p>
                    <p style={{ marginLeft: '150px', }}>
                      <Button onClick={() => { sc(item._id) }} size='mini' shape='rounded' color='primary' fill='outline'>
                        删除
                      </Button></p>
                  </div>
                </div>
              ))}
              <div className="bc">
                <Button onClick={() => { navigate('/gg/addy') }} style={{ width: '300px', marginLeft: '45px', marginTop: '20px' }} shape='rounded' color='primary'>
                  新增常用药
                </Button>
              </div>
            </div>
          </Tabs.Tab>
          <Tabs.Tab title='常见处方' key='vegetables'>
            <div className="ge">
              {bar2.filter(item => item.zt != true).map(i => (
                <div key={i._id} className="cj">
                  <p style={{ marginLeft: '10px', fontSize: '15px', marginTop: '20px' }}>{i.zd}</p>
                  <p style={{ marginLeft: '10px', fontSize: '15px', marginTop: '20px' }}>{i.yj}</p>
                  <p style={{ position: 'absolute', right: '40px', bottom: '20px' }}>
                    <Button onClick={() => { scf(i._id) }} size='mini' shape='rounded' color='primary' fill='outline'>
                      删除
                    </Button>
                    <Button onClick={() => { bj(i._id) }} style={{ marginLeft: '10px' }} size='mini' shape='rounded' color='primary' fill='solid'>
                      编辑处方
                    </Button>
                  </p>
                  <svg onClick={() => { cj(i._id) }} style={{ position: 'absolute', top: '20px', size: '22px', height: '22px', left: '250px' }} t="1724990012305" className="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2496" width="200" height="200"><path d="M724 511.4L361 947.6c-12.2 14.6-33.9 16.6-48.5 4.4-14.6-12.2-16.6-33.9-4.4-48.5l326.2-392-326.3-391c-12.2-14.6-10.2-36.3 4.4-48.5 14.6-12.2 36.3-10.2 48.5 4.4l363.1 435z" p-id="2497" fill="#2c2c2c"></path></svg>
                </div>
              ))}

            </div>
          </Tabs.Tab>
          <Tabs.Tab title='历史处方' key='animals'>
            <div className="ge">
              {bar2.filter(item => item.zt).map(i => (
                <div key={i._id} className="cj">
                  <p style={{ marginLeft: '10px', fontSize: '15px', marginTop: '20px' }}>{i.zd}</p>
                  <p style={{ marginLeft: '10px', fontSize: '15px', marginTop: '20px' }}>{i.yj}</p>
                  <p style={{ position: 'absolute', right: '40px', bottom: '20px' }}>
                    <Button onClick={()=>{upcf(i._id)}} size='mini' shape='rounded' color='primary' fill='outline'>
                      设为常用处方
                    </Button>
                    <Button onClick={()=>{xu(i._id)}} style={{ marginLeft: '10px' }} size='mini' shape='rounded' color='primary' fill='solid'>
                      续处方
                    </Button>
                  </p>
                  <svg onClick={() => { tzhist(i._id) }} style={{ position: 'absolute', top: '20px', size: '22px', height: '22px', left: '250px' }} t="1724990012305" className="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2496" width="200" height="200"><path d="M724 511.4L361 947.6c-12.2 14.6-33.9 16.6-48.5 4.4-14.6-12.2-16.6-33.9-4.4-48.5l326.2-392-326.3-391c-12.2-14.6-10.2-36.3 4.4-48.5 14.6-12.2 36.3-10.2 48.5 4.4l363.1 435z" p-id="2497" fill="#2c2c2c"></path></svg>
                </div>
              ))}

            </div>
          </Tabs.Tab>
        </Tabs>
      </div>



    </div>
  )
}
